define(['jquery', 'httpModule', 'mustache', 'api', 'moment', 'echarts', 'webSocketModule'], function($, httpModule, mustache, api, moment, echarts, webSocketModule) {
  var that = {};
  var cacheTpl = {};
  var $node;
  var checkId = [];

  var chartTypeMap = {
    0: 'line',
    1: 'bar',
    2: 'pie'
  };

  var initSocket = function(ids) {
    webSocketModule.initSocket(ids, 'item');
    webSocketModule.onMessage(that.onMessage);
    // setInterval(function() {
    //   that.onMessage();
    // }, 5000)
  };

  var onMessage = function(data) {

    if (data) {
      var itemId = data.itemid;
      var value = data.value;
      var date = moment(parseInt(data.clock * 1000)).format('YYYY-MM-DD hh:mm:ss');

      that.followList && that.followList.map(function(item) {

        if (item.item_id == itemId) {
          item.value = value;
          item.date = date;
        };
      });
    };

    if (that.followList.length > 0) {
      console.log('that.panelFlag', that.panelFlag);

      if (that.panelFlag === 1) {
        $node.find('.follow-list').empty();
        that.initTpl($node.find('.follow-list'), cacheTpl['followTable'], {
          list: that.followList
        });
      }
      else if (that.panelFlag === 2) {

        var trs = $('.htrd-l-panel-enlarge').find('.content').find('.js-max-follow-list').find('tr');

        console.log('that.followList', that.followList);
        trs.each(function(index, item) {

          if ($(item).find('td').length > 0) {
            var id = $(item).find('td').eq(5).find('input').attr('data-id');

            var data = that.followList.filter(function(item, index) {
              return item.id == id;
            });

            $(item).find('td').eq(3).text(data[0].value);
            $(item).find('td').eq(4).text(data[0].date);
          };
          // item.find('td').eq(3)
        })
        // var checkItemList = $('.htrd-l-panel-enlarge').find('input:checked');
        // checkItemList.each(function(index, item) {
        //   var id = $(item).attr('data-id');
        //   checkId.push(id);
        // });
        // console.log('checkId', checkId);
        //
        // that.followList.map(function(item, index) {
        //
        //   if (checkId.indexOf(item.id) !== -1) {
        //     item.active = true;
        //   };
        // })
        //
        // console.log('that.followList', that.followList);


        // $('.htrd-l-panel-enlarge').find('.content').empty();
        // that.initTpl($('.htrd-l-panel-enlarge').find('.content'), cacheTpl['followTable1'], {}, function() {
        //   that.initTpl($('.htrd-l-panel-enlarge').find('.content').find('.js-max-follow-list'), cacheTpl['followTable-max'], {
        //     list: that.followList || []
        //   });
        // });
      };
    };
  };

  var addFollowSubmit = function() {
    var followList = [];
    var checkItemList = $('#myModal').find('input:checked');
    checkItemList.each(function(index, item) {
      var id = $(item).attr('data-id');
      var name = $(item).attr('data-item-name');
      followList.push({
        item_id: id,
        item_name: name,
        host_id: that.hostId,
        host_name: that.hostName
      });
    });

    httpModule.baseServ({
      url: api.addFollow,
      param: {
        follows: JSON.stringify(followList)
      }
    })
    .then(function(ret) {
      $('.htrd-l-panel-enlarge').find('.content').empty();
      that.getFollowList($('.htrd-l-panel-enlarge').find('.content'), cacheTpl['followTable1']);
      $('#myModal').modal('hide');
    });
  };

  var addFollow = function() {

    $('#myModal').modal({
      show: true,
      remote: '../template/modal/base.html'
    });

    $('#myModal').on('shown.bs.modal', function() {
      $('#myModal').find('.chart-group-filter').empty();
      that.getGroupList($('#myModal').find('.chart-group-filter'));
    });

    $("#myModal").on("hidden.bs.modal", function() {
      $(this).removeData("bs.modal");
    });
  };

  var delFollow = function() {
    var checkId = [];

    if (!!confirm('确认删除选中的关注?')) {
      var checkItemList = $('.htrd-l-panel-enlarge').find('input:checked');
      checkItemList.each(function(index, item) {
        var id = $(item).attr('data-id');
        checkId.push(id);
      });

      httpModule.baseServ({
        url: api.delFollow,
        param: {
          id: checkId.join(',')
        }
      })
      .then(function(ret) {
        $('.htrd-l-panel-enlarge').find('.content').empty();
        that.getFollowList($('.htrd-l-panel-enlarge').find('.content'), cacheTpl['followTable1']);
      });
    };
  };

  var showEnlargeNotivePanel = function() {
    that.panelFlag = 1;
    webSocketModule.closeSocket();
    $('.htrd-l-panel-enlarge').show();
    $('.js-panel-enlarge-title').text('告警列表');
    $('.htrd-l-panel-enlarge').find('.content').empty().append('<div class="chart-group-filter" style="height: 30px;width: 100%;float: none;" ></div><div class="htrd-c-chart-notice-list js-chart-notice-list" style="overflow: auto;height: 400px;width: 100%;margin: 15px auto;" ></div>');
    that.getGroupList($('.htrd-l-panel-enlarge').find('.content').find('.chart-group-filter'));
  };

  var showEnlargeFollowPanel = function() {
    that.panelFlag = 2;
    $('.htrd-l-panel-enlarge').show();
    $('.js-panel-enlarge-title').text('重点关注');
    $('.htrd-l-panel-enlarge').find('.content').empty();
    that.getFollowList($('.htrd-l-panel-enlarge').find('.content'), cacheTpl['followTable1']);
  };

  var showEnlargeGraphPanel = function(evt, data) {
    that.panelFlag = 3;
    webSocketModule.closeSocket();
    $('.htrd-l-panel-enlarge').show();
    $('.js-panel-enlarge-title').text('拓扑展示');
    $('.htrd-l-panel-enlarge').find('.content').empty();
    that.initTpl($('.htrd-l-panel-enlarge').find('.content'), cacheTpl['graph']);
  };

  var hideEnlargePanel = function() {
    that.panelFlag = 1;
    $('.htrd-l-panel-enlarge').hide();
    $node.find('.follow-list').empty();
    that.getFollowList();
  };

  var getSeriesData = function(items) {
    var lineList = [];
    var series = [];
    var dateList;
    items && items.map(function(data) {
      dateList = [];

      var model = {
        name: data.name,
        type: 'line',
        smooth: true,
        symbol: 'none',
        gitemId: data.gitemid,
        sampling: 'average',
        data: []
      };

      lineList.push(data.name);
      data.items && data.items.map(function(item) {
        model.data.push(item.value);
        dateList.push(moment(parseInt(item.clock * 1000)).format('YYYY-MM-DD HH:mm:ss'));
      });
      series.push(model);
    });

    return {
      series: series,
      date: dateList,
      lineList: lineList
    };
  }

  // 初始化图表
  var initChart = function(title, line, node, date, chartSeries, type) {
    chartSeries && chartSeries.map(function(serie) {
      serie.type = type;
    });

    // 基于准备好的dom，初始化echarts图表
    var myChart = echarts.init(node[0]);

    myChart.hideLoading();

    var option = {
        color: [
            '#2ec7c9','#b6a2de','#5ab1ef','#ffb980','#d87a80',
            '#8d98b3','#e5cf0d','#97b552','#95706d','#dc69aa',
            '#07a2a4','#9a7fd1','#588dd5','#f5994e','#c05050',
            '#59678c','#c9ab00','#7eb00a','#6f5553','#c14089'
        ],
        tooltip: {
            trigger: 'axis',
            position: function (pt) {
                return [pt[0], '10%'];
            }
        },
        legend: {
          data: line
        },

        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: date
        },
        yAxis: {
            type: 'value',
            boundaryGap: [0, '100%'],
            axisLabel: {
              formatter: function (value, index) {
                var text;

                if (value >= 1000 * 1000 * 1000 * 1000) {
                  text = (value / 1000 / 1000 / 1000 / 1000) + 'T';
                }

                else if (value >= 1000 * 1000 * 1000) {
                  text = (value / 1000 / 1000/ 1000) + 'G';
                }

                else if (value >= 1000 * 1000) {
                  text = (value / 1000 / 1000) + 'M';
                }

                else if (value >= 1000) {
                  text = (value / 1000) + 'K';
                }

                else {
                  text = value;
                };
                return text;
              }
            }
        },
        grid: {
          x: 60,
          x2: 60
        },
        series: chartSeries
    };

    // 为echarts对象加载数据
    myChart.setOption(option, true);
  };

  var parseYear = function(day) {
    return parseInt(day % 365 % 30);
  };

  var confirmNotive = function() {
    var id = $(this).attr('data-id');
    var $tr = $(this).parent().parent();
    var name = $tr.children('td').eq(1).children().text();

    if (confirm('你确定处理 ' + name + ' 吗?')) {
      httpModule.baseServ({
        url: api.delWarnList,
        dataType: 'jsonp',
        param: {
          objectids: id
        }
      })
      .then(function(ret) {
        $tr.remove();
        alert('确认成功');
      }, function(err) {
        alert('确认失败');
      });
    };
  };

  var workingDate = function (timestamp){

    if (timestamp){
      var yearDate;
      var day = Math.floor(Math.abs(timestamp) / 1000 / 60 / 60 / 24);
      var dayToYear = parseYear(day);

      // 时间不足一个月
      if (day < 30) {
        return day + '天';
      };

      // 时间不足一个月但不足一年
      if (day >= 30 && day <= 365) {
        // var dayToYear = yearDate + '月零' + dayToYear + '天';
        var dayToYear = (yearDate || '') + '月零' + dayToYear + '天';

        if (dayToYear === 0) {
          var year = dayToYear + '个月';
          return year;
        };
        return year;
      }

      // 时间超过一年
      if (day > 365 && dayToYear < 12) {
        var year;

        if (parseInt(day % 365 / 30) == 0) {
          year = parseInt(day / 365) + '年';
        } else {
          year = parseInt(day / 365) + '年零' + dayToYear + '月';
        };
        return year;
      };
    };
  };

  var noticeMap = {
    0: {
      text: '未分类',
      color: 'text-warning'
    },

    1: {
      text: '信息',
      color: 'text-info'
    },

    2: {
      text: '警告',
      color: 'text-warning'
    },

    3: {
      text: '一般严重',
      color: 'js-list-golden'
    },

    4: {
      text: '严重告警',
      color: 'js-list-orange'
    },

    5: {
      text: '灾难告警',
      color: 'text-danger'
    }
  };

  var nodeLocationMap = [
    {
      x: 110,
      x2: 125,
      y: 30,
      y2: 45,
      ip: '172.22.3.120'
      // ip: '10.10.10.11'
    },

    {
      x: 126,
      x2: 140,
      y: 30,
      y2: 45,
      ip: '172.22.3.122'
    },



    {
      x: 200,
      x2: 215,
      y: 30,
      y2: 45,
      ip: '172.22.1.120'
    },

    {
      x: 216,
      x2: 230,
      y: 30,
      y2: 45,
      ip: '172.22.2.120'
    },




    {
      x: 280,
      x2: 295,
      y: 30,
      y2: 45,
      ip: '192.168.99.120'
    },

    {
      x: 296,
      x2: 310,
      y: 30,
      y2: 45,
      ip: '192.168.99.122'
    },





    {
      x: 35,
      x2: 50,
      y: 170,
      y2: 185,
      ip: '192.168.102.253'
    },

    {
      x: 51,
      x2: 65,
      y: 170,
      y2: 185,
      ip: '192.168.102.254'
    },

    {
      x: 85,
      x2: 100,
      y: 170,
      y2: 185,
      ip: '192.168.101.152'
    },

    {
      x: 101,
      x2: 115,
      y: 170,
      y2: 185,
      ip: '192.168.101.254'
    },



    {
      x: 130,
      x2: 145,
      y: 170,
      y2: 185,
      ip: '192.168.106.122'
    },

    {
      x: 146,
      x2: 160,
      y: 170,
      y2: 185,
      ip: '192.168.106.123'
    },



    {
      x: 195,
      x2: 210,
      y: 170,
      y2: 185,
      ip: '172.16.1.3'
    },

    {
      x: 211,
      x2: 225,
      y: 170,
      y2: 185,
      ip: '172.16.1.5'
    },








    {
      x: 80,
      x2: 100,
      y: 235,
      y2: 250,
      ip: '192.168.101.152'
    },

    {
      x: 101,
      x2: 120,
      y: 235,
      y2: 250,
      ip: '192.168.101.153'
    },

    {
      x: 125,
      x2: 145,
      y: 235,
      y2: 250,
      ip: '192.168.101.254'
    },

    {
      x: 146,
      x2: 166,
      y: 235,
      y2: 250,
      ip: '192.168.101.253'
    },

    {
      x: 216,
      x2: 235,
      y: 270,
      y2: 284,
      ip: ''
    },

    {
      x: 236,
      x2: 257,
      y: 270,
      y2: 284,
      ip: ''
    },

    {
      x: 90,
      x2: 140,
      y: 340,
      y2: 370,
      ip: ''
    },

    {
      x: 210,
      x2: 260,
      y: 340,
      y2: 370,
      ip: ''
    },
  ];

  var loadTpls = function() {
    $.get('../template/chartInfo.html')
    .then(function(ret) {
      cacheTpl['chartInfo'] = ret;
    });

    $.get('../template/dropdownMenu.html')
    .then(function(ret) {
      cacheTpl['dropdownMenu'] = ret;
    });

    $.get('../template/warnTable.html')
    .then(function(ret) {
      cacheTpl['warnTable'] = ret;
    });

    $.get('../template/followTable.html')
    .then(function(ret) {
      cacheTpl['followTable'] = ret;
    });

    $.get('../template/followTable1.html')
    .then(function(ret) {
      cacheTpl['followTable1'] = ret;
    });

    $.get('../template/followTable-max.html')
    .then(function(ret) {
      cacheTpl['followTable-max'] = ret;
    });

    $.get('../template/graph.html')
    .then(function(ret) {
      cacheTpl['graph'] = ret;
    });

    $.get('../template/configTable.html')
    .then(function(ret) {
      cacheTpl['configTable'] = ret;
    });

    $.get('../template/list.html')
    .then(function(ret) {
      cacheTpl['list'] = ret;
    });
  };

  var initTpl = function(node, tpl, data, callback) {
    var $tpl = mustache.render(tpl, data || {});
    node.append($tpl);
    callback && callback($tpl);
  };

  // 根据xy坐标获取节点信息
  var getNodeInfoByLocation = function(evt) {
    var offX = evt.offsetX;
    var offY = evt.offsetY;
    var nodeInfo = {};

    nodeLocationMap && nodeLocationMap.map(function(item) {

      if (item.x <= offX && offX <= item.x2 && item.y <= offY && offY <= item.y2) {
        nodeInfo = item;
        return false;
      };
    });

    if (nodeInfo.ip) {
      httpModule.baseServ({
        url: api.getHostIdByIp,
        param: {
          ip: nodeInfo.ip
        }
      })
      .then(function(ret) {
        var hostId = ret.result[0].hostid;
        var groupId;
        var groupName;
        that.groupList && that.groupList.map(function(item) {
          item.hosts && item.hosts.map(function(host) {

            if (host.hostid === hostId) {
              groupId = item.groupid;
              groupName = item.name;
            };
          });
        });
        activeGroupAndHost(groupId, groupName, hostId);
        // if (that.groupList) {
        //   that.hostListChange(null, hostId);
        // } else {
        //
        // };
      });
    };
    console.log('offX', offX);
    console.log('offY', offY);
    console.log('nodeInfo', nodeInfo);
    return nodeInfo;
  };

  var activeGroupAndHost = function(groupId, groupName, hostId) {
    var hostName;
    $node.find('.groupList').find('.groupText').text(hostName);
    $node.find('.groupText').text(groupName);
    that.getHostListByGroupId(groupId, null, function(ret) {
      that.hostList && that.hostList.map(function(item) {

        if (item.hostid == hostId) {
          hostName = item.name;
        };
      });
      $node.find('.hostList').find('.groupText').text(hostName);
      $node.find('.chartList').remove();
      $node.find('.js-chart-notice-list table').remove();
      that.getChartListByHostId(hostId);
      that.getNoticeList(hostId);
    });
  };

  var groupListChange = function(evt) {
    var groupId = $(this).attr('data-group-id');
    var text = $(this).find('a').html();
    $(this).parent().prev().find('.groupText').text(text);

    if (evt.data == 1) {
      $('#myModal').find('.hostList').remove();
      $('#myModal').find('.js-config-list').find('table').remove();
      that.getHostListByGroupId(groupId, $('#myModal').find('.chart-group-filter'), null);
    }
    else if (evt.data == 2) {
      $('.htrd-l-panel-enlarge').find('.content').find('.hostList').remove();
      $('.htrd-l-panel-enlarge').find('.content').find('.js-chart-notice-list table').remove();
      setTimeout(function() {
        that.getNoticeList(null, groupId, $('.htrd-l-panel-enlarge').find('.content').find('.js-chart-notice-list'));
      }, 200);

      setTimeout(function() {
        that.getHostListByGroupId(groupId, $('.htrd-l-panel-enlarge').find('.content').find('.chart-group-filter'));
      }, 500);
    }
    else {
      $node.find('.ht-c-panel-close').removeClass('ht-c-panel-close').addClass('ht-c-panel-large');
      $node.find('.js-panel-chart').hide();
      $node.find('.chartList').remove();
      $node.find('.js-chart-notice-list table').remove();
      setTimeout(function() {
        that.getNoticeList(null, groupId);
      }, 200);

      setTimeout(function() {
        that.getHostListByGroupId(groupId);
      }, 500);
    };
  };

  var hostListChange = function(evt, hostId, hostName) {
    var hostId = hostId || $(this).attr('data-host-id');
    var text = hostName || $(this).find('a').html();
    that.hostId = hostId;
    that.hostName = text;
    $(this).parent().prev().find('.groupText').text(text);

    if (evt.data == 1) {
      that.getConfigList(hostId);
      $('#myModal').find('.js-config-list').find('table').remove();
    }
    else if (evt.data == 2) {
      $('.htrd-l-panel-enlarge').find('.content').find('.js-chart-notice-list table').remove();
      setTimeout(function() {
        that.getNoticeList(hostId, null, $('.htrd-l-panel-enlarge').find('.content').find('.js-chart-notice-list'));
      }, 200);
    }
    else {
      $node.find('.ht-c-panel-close').removeClass('ht-c-panel-close').addClass('ht-c-panel-large');
      $node.find('.js-panel-chart').hide();
      $node.find('.chartList').remove();
      $node.find('.js-chart-notice-list table').remove();
      setTimeout(function() {
        that.getNoticeList(hostId);
      }, 200);

      setTimeout(function() {
        that.getChartListByHostId(hostId);
      }, 500);
    };
  };

  var chartListChange = function(evt) {
    var graphId = $(this).attr('data-graph-id');
    var text = $(this).find('a').html();
    $(this).parent().prev().find('.groupText').text(text);
    that.getChartInfo(graphId);
  };

  var getConfigList = function(hostId) {
    httpModule.baseServ({
      url: api.getConfigList,
      param: {
        hostids: hostId
      }
    })
    .then(function(ret) {
      var result = ret.result;
      var followActiveList = [];
      that.followList && that.followList.map(function(follow) {

        if (follow.host_id == hostId) {
          followActiveList.push(follow);
        };
      });

      // 遍历获取未选择过的监控项
      followActiveList && followActiveList.map(function(follow) {
        ret.result && ret.result.map(function(item, index) {

          if (item.itemid == follow.item_id) {
            result.splice(index, 1);
          };
        });
      });

      result && result.map(function(item, index) {
        item.index = (index + 1);
      });

      that.initTpl($('#myModal').find('.js-config-list'), cacheTpl['configTable'], {
        list: result
      });
    });
  };

  var getGroupList = function(node, tpl) {
    return httpModule.baseServ({
      url: api.getHostGroupList
    })
    .then(function(ret) {
      that.groupList = ret.result;
      console.log('that.groupList', that.groupList);
      // that.groupList.push({
      //   name: '全部群组'
      // });
      that.initTpl(node || $node.find('.chart-group-filter'), tpl || cacheTpl['dropdownMenu'], {
        title: '群组',
        type: 'groupList',
        list: ret.result
      }, function($tpl) {
        $('.htrd-l-panel-enlarge').find('.content').find('.js-chart-notice-list table').remove();
        that.getNoticeList(null, null, $('.htrd-l-panel-enlarge').find('.content').find('.js-chart-notice-list'));
      });
    });
  };

  var getHostListByGroupId = function(groupId, node, callback) {
    return httpModule.baseServ({
      param: {
        groupids: groupId
      },
      url: api.getHostList
    })
    .then(function(ret) {
      that.hostList = ret.result;
      // that.hostList.push({
      //   name: '全部主机'
      // });

      if (node) {
        node.find('.hostList').remove();
        node.find('.configList').remove();
      } else {
        $node.find('.hostList').remove();
        $node.find('.configList').remove();
      };
      that.initTpl(node || $node.find('.chart-group-filter'), cacheTpl['dropdownMenu'], {
        title: '主机',
        type: 'hostList',
        list: ret.result
      }, function(ret) {
        callback && callback(ret);
      });
    });
  };

  var getChartListByHostId = function(hostId) {
    httpModule.baseServ({
      url: api.getChartSeries,
      param: {
        hostids: hostId
      }
    })
    .then(function(ret) {
      that.initTpl($node.find('.chart-group-filter'), cacheTpl['dropdownMenu'], {
        title: '图形',
        type: 'chartList',
        list: ret.result
      });
    });
  };

  // 获取重点监控列表
  var getFollowList = function(dom, tpl) {
    console.log('getFollowList');

    if (!!tpl) {
      that.initTpl(dom || $node.find('.follow-list'), tpl || cacheTpl['followTable'], {}, function() {
        httpModule.baseServ({
          url: api.getFollowList
        })
        .then(function(ret) {

          if ($.isEmptyObject(ret)) {
            that.followList = ret.result || [];
          } else {
            that.followList = ret.result || ret || [];
          };

          that.followList && that.followList.map(function(item, index) {
            item.index = (index + 1);
          });

          that.initTpl($('.js-max-follow-list'), cacheTpl['followTable-max'], {
            list: that.followList
          }, function(item) {
            var ids = [];

            var result = that.followList;
            result && result.map(function(item) {
              ids.push(item.item_id);
            });
            initSocket(ids);
          });
        });
      });
    } else {

      httpModule.baseServ({
        url: api.getFollowList
      })
      .then(function(ret) {

        if ($.isEmptyObject(ret)) {
          that.followList = ret.result || [];
        } else {
          that.followList = ret.result || ret || [];
        };

        that.followList && that.followList.map(function(item, index) {
          item.index = (index + 1);
        });

        that.initTpl(dom || $node.find('.follow-list'), cacheTpl['followTable'], {
          list: that.followList
        }, function(item) {
          var ids = [];

          var result = that.followList;
          result && result.map(function(item) {
            ids.push(item.item_id);
          });
          initSocket(ids);
        });
      });
    };
  };

  // 获取告警列表
  var getNoticeList = function(hostId, groupId, node) {
    var data = {};

    if (groupId) {
      data.groupids = groupId;
    }
    else if (hostId) {
      data.hostids = hostId;
    };
    var promise = httpModule.baseServ({
      url: api.getWarnList,
      param: data
    })
    .then(function(ret) {
      ret.result && ret.result.map(function(item) {
        item.warnTypeColor = noticeMap[item.priority].color;
        item.priority = noticeMap[item.priority].text;
        item.hosts = item.hosts[0].name;

        var difftime  = new Date().getTime() - parseInt(item.lastchange) * 1000;

        // 持续时间
        item.duration_time = workingDate(difftime);

        item.lastchange = moment(parseInt(item.lastchange) * 1000).format('YYYY-MM-DD hh:mm:ss');
      });

      that.initTpl(node || $node.find('.js-chart-notice-list'), cacheTpl['warnTable'], {
        list: ret.result
      });
    });

    return promise;
  };

  // 根据chartId获取chart
  var getChartInfo = function(chartId) {
    httpModule.baseServ({
      url: api.getChartSeries,
      param: {
        graphids: chartId
      }
    })
    .then(function(ret) {
      var chartDom = $node.find('.js-htrd-c-chart-info');
      chartDom.addClass('show');
      $node.find('.ht-c-panel-large').removeClass('ht-c-panel-large').addClass('ht-c-panel-close');
      $node.find('.js-panel-chart').show();

      // $node.find('.js-chart-notice-list').addClass('mini');
      console.log('ret.result', ret.result);
      var title = ret.result[0].name;
      var items = ret.result[0].gitems;
      var units = items[0].units;
      var hostName = ret.result[0].hosts[0].name;
      var seriesData = that.getSeriesData(items);
      var type = chartTypeMap[ret.result[0].graphtype];
      setTimeout(function() {
        $node.find('.chart-title').html([hostName, title].join(' - '));
        $node.find('.chart-subtext').html(['单位', units].join('/'));
        that.initChart(title, seriesData.lineList, chartDom, seriesData.date, seriesData.series, type);
      }, 200);
    });
  };

  var parseDOM = function(node) {
    $node = node;
  };

  var bindListener = function() {
    that.getNodeInfoByLocation = getNodeInfoByLocation;
    that.getGroupList = getGroupList
    that.getFollowList = getFollowList;
    that.getNoticeList = getNoticeList;
    that.getChartInfo = getChartInfo;
    that.groupListChange = groupListChange;
    that.hostListChange = hostListChange;
    that.chartListChange = chartListChange;
    that.loadTpls = loadTpls;
    that.initTpl = initTpl;
    that.getHostListByGroupId = getHostListByGroupId;
    that.getChartListByHostId = getChartListByHostId;
    that.confirmNotive = confirmNotive;
    that.initChart = initChart;
    that.getSeriesData = getSeriesData;
    that.getConfigList = getConfigList;
    that.initSocket = initSocket;
    that.onMessage = onMessage;
  };

  var initPlugins = function() {
    that.loadTpls();
    that.getGroupList().then(function() {
      setTimeout(function() {
        that.getNoticeList()
        .then(function() {
          setTimeout(function() {
            that.getFollowList();
          }, 1000);
        })
      }, 300);
    });

    that.panelFlag = 1;

    $node.delegate('.js-htrd-c-host-map', 'click', getNodeInfoByLocation);
    $node.delegate('.groupList li', 'click', groupListChange);
    $node.delegate('.hostList li', 'click', hostListChange);
    $node.delegate('.chartList li', 'click', chartListChange);
    $node.delegate('.js-list-deal','click', confirmNotive);
    $node.delegate('.js-follow-enlarge','click', showEnlargeFollowPanel);
    $node.delegate('.js-graph-enlarge','click', showEnlargeGraphPanel);
    $node.delegate('.js-notive-enlarge', 'click', showEnlargeNotivePanel);

    $('.htrd-l-panel-enlarge').delegate('.js-close-enlarge-panel', 'click', hideEnlargePanel);
    $('.htrd-l-panel-enlarge').delegate('.js-del-follow', 'click', delFollow);
    $('.htrd-l-panel-enlarge').delegate('.js-add-follow', 'click', addFollow);

    $('#myModal').delegate('.groupList li', 'click', 1, groupListChange);
    $('#myModal').delegate('.hostList li', 'click', 1, hostListChange);
    $('#myModal').delegate('.js-add-follow-submit', 'click', addFollowSubmit);

    $('.htrd-l-panel-enlarge').find('.content').delegate('.groupList li', 'click', 2, groupListChange);
    $('.htrd-l-panel-enlarge').find('.content').delegate('.hostList li', 'click', 2, hostListChange);
    $('.htrd-l-panel-enlarge').find('.content').delegate('.js-list-deal', 'click', confirmNotive);
  };

  var init = function(node) {
    parseDOM(node);
    bindListener();
    initPlugins();
  };

  that.init = init;
  return that;
});
